<%--
  Created by IntelliJ IDEA.
  User: RuoLi
  Date: 2023/3/6
  Time: 12:54
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>处理中心</title>
    <!-- import CSS -->
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/index.css">
    <!-- import Vue before Element -->
    <script src="<%=request.getContextPath()%>/js/vue.js"></script>
    <!-- import JavaScript -->
    <script src="<%=request.getContextPath()%>/js/element-ui.js"></script>
    <!-- axios -->
    <script src="<%=request.getContextPath()%>/js/axios.js"></script>
    <%--icon--%>
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/fonts/element-icons.ttf">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/fonts/element-icons.woff">
</head>
<body>
<div id="app">
    <el-page-header @back="goBack" content="处理中心"></el-page-header>
    <el-divider></el-divider>
    <el-row>
        <el-col :span="15">
            <el-table
                    :data="tableData"
                    border
                    height="615"
                    style="width: 100%">
                <el-table-column
                        prop="messageId"
                        label="编号"
                        width="100">
                </el-table-column>
                <el-table-column
                        prop="userAccount"
                        label="账号"
                        width="100">
                </el-table-column>
                <el-table-column
                        prop="messageContext"
                        label="反馈信息"
                        width="680">
                </el-table-column>
                <el-table-column
                        label="操作"
                        width="100">
                    <template slot-scope="scope">
                        <el-button
                                type="primary"
                                @click="AccountSuspension(scope.$index, scope.row)">回复
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-col>
        <el-col :offset="1" :span="8">
            <el-card class="box-card">
                <div slot="header" class="clearfix">
                    <span>回复历史</span>
                </div>
                <span>雨纷纷</span>
                <el-divider direction="vertical"></el-divider>
                <span>旧故里</span>
                <el-divider direction="vertical"></el-divider>
                <span>草木深</span>
            </el-card>
        </el-col>
    </el-row>
</div>
</body>
<script>
    new Vue({
        el: "#app",
        data() {
            return {
                tableData:[]
            }
        },
        methods: {
            goBack() {

            },
            getProcessMessageData() {
                axios({
                    url: "/online_website/common/log/GetProcessInfoMessage",
                    method: "get",
                    contentType: "application/json",
                }).then((res) => {
                      this.tableData=res.data;
                    console.log(this.tableData)
                })
            },
            //回复反馈
            AccountSuspension(index,row){
                let messageId=row.messageId;
                let userAccount=row.userAccount;
                this.$prompt('请输入内容', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                }).then(({ value }) => {
                    axios({
                        url: "/online_website/common/log/ReplyProcessInfoMessage",
                        method: "get",
                        contentType: "application/json",
                        params: {
                            messageId:messageId,
                            userAccount:userAccount,
                            replyMessage:value,
                        }
                    }).then((res) => {
                        if (res.data===1){
                            this.$message({
                                message: '已成功发送',
                                type: 'success'
                            });
                        }
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消输入'
                    });
                });
            }
        },
        created() {
            this.getProcessMessageData();
            //获取回复数据 已回复禁用按钮
        }
    })
</script>
</html>
